<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <title>传智健康后台登录</title>
    <link rel="stylesheet" href="css/font-awesome-4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="css/style.css">
    <script src="../js/vue.js"></script>
    <!--看板娘-->
    <script src="https://cdn.jsdelivr.net/gh/stevenjoezhang/live2d-widget@latest/autoload.js"></script>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/font-awesome/css/font-awesome.min.css">
</head>

<body>
<div class="materialContainer" id="app">
    <div class="box">

        <form method="post" action="/login.do">
            <div class="title" style="text-align: center">传智健康登录</div>
            <div class="input">
                <label for="username">用户名</label>
                <input type="text" name="username" id="username">
                <span class="spin"></span>
            </div>
            <div class="input">
                <label for="password">密码</label>
                <input type="password" name="password" id="password">
                <span class="spin"></span>
            </div>
            <div><span id="err" style="text-align: center; color: red"></span></div>
            <div class="button login">
                <button type="submit">
                    <span>请登录</span>
                    <i class="fa fa-check"></i>
                </button>
            </div>
        </form>
        <a href="../myback/password.html" class="pass-forgot">忘记密码？</a>

    </div>

    <div class="overbox">
        <div class="material-button alt-2">
            <span class="shape"></span>
        </div>
        <div class="title">注册</div>
        <div class="input">
            <label for="regname">用户名</label>
            <input type="text" id="regname" v-model="formData.username">
            <span class="spin"></span>
        </div>
        <div class="input">
            <label for="regpass">密码</label>
            <input type="password" id="regpass" v-model="formData.password">
            <span class="spin"></span>
        </div>
        <div class="input">
            <label for="reregpass">确认密码</label>
            <input type="password" id="reregpass" v-model="loginInfo.password">
            <span class="spin"></span>
        </div>
        <div class="button">
            <button type="button" @click="registered()">
                <span>注册</span>
            </button>
        </div>
    </div>

</div>
<script src="js/jquery.min.js"></script>
<script src="js/index.js"></script>

<!-- 引入组件库 -->
<script src="../js/vue.js"></script>
<script src="../plugins/elementui/index.js"></script>
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script src="../js/axios-0.18.0.js"></script>

<script type="text/javascript">
    var vue = new Vue({
        el:'#app',
        data:{
            //验证码信息
            loginInfo:{},
            //修改用户的信息
            formData:{}
        },
        created(){
            let url = document.location.toString();
            console.log(url);
            console.log("123");
            if (url.split("?")[1]=="err"){
                $("#err").html("用户名或密码错误");
                //alert("用户名或密码错误");
            }
        },
        methods:{
            //注册用户
            registered(){
                //判断两次输入的密码是否相同
                if (this.formData.password!=null && this.loginInfo.password!=null){
                    if (this.formData.password!=this.loginInfo.password){
                        this.$message.error("两次密码输入不相符");
                    }else {
                        //注册用户
                        axios.post("/user/saveUserAndRole.do",this.formData).then((res)=>{
                            if (res.data.flag){
                                //成功
                                this.$message.success("注册成功");
                                window.location.href='../mylogin/index.html';
                            } else {
                                //失败
                                this.$message.error("修改失败");
                                window.location.href='../mylogin/index.html';
                            }
                        })
                    }
                } {
                    this.$message.error("请输入密码")
                }

            }
        }
    });
</script>
</body>

</html>